<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <div th:fragment="basicrefrence">
        <link rel="canonical" href="https://www.syyrjx.xyz"/>
        <link rel="stylesheet" href="/lib/semantic/semantic.min.css" />
        <link rel="stylesheet" type="text/css" href="/css/SyyrjxStyle.css">
        <script type="text/javascript" src="/js/jquery-3.6.0.min.js"></script>
        <script src="/lib/semantic/semantic.min.js"></script>
    </div>
</head>
<body>



<div th:fragment="nav" class="ui attached inverted stackable menu">
    <div style="font-size: 40px" class="ui teal header item">四月栈</div>
    <a href="/" class="m-hide m-mobile-hide item" ><i class="home icon"></i>首页</a>
    <a href="/tool" class="m-hide m-mobile-hide item" ><i class="book icon"></i>工具</a>
    <a href="/types" class="m-hide m-mobile-hide item" ><i class="idea icon"></i>分类</a>
    <a href="/archives" class="m-hide m-mobile-hide item" ><i class="clone icon"></i>归档</a>
    <a href="/about" class="m-hide m-mobile-hide item" ><i class="info icon"></i>关于我</a>
    <!--                <a href="/login" class="m-hide m-mobile-hide item"><i class="eraser icon"></i>管理员登录</a>-->
    <a id="menuShowBtn"  class="ui black icon button m-topRight m-mobile-show">
        <i class="sidebar icon"></i>
    </a>
    <script type="text/javascript">
        $("#menuShowBtn").click(function () {
            $(".m-hide").toggleClass('m-mobile-hide');
        })
    </script>
</div>



<footer th:fragment="footer" class="ui attached inverted segment">
    <!--吉祥物-->
    <div style="position: fixed;bottom: 0;left: 0"><img width="50" src="/images/left.png" /></div>
    <div style="position: fixed;bottom: 0;right: 0"><img width="50" src="/images/right.png" /></div>

    <div class="ui center aligned container">
        <div class="ui inverted divided stackable grid">
            <div class="three wide column">
                <!--第一列,个人图片-->
                <div class="ui item">
                    <img src="/images/bottom.jpg" class="ui rounded centered image" />
                </div>
            </div>
            <!--第二列-->
            <div class="three wide column">
                <h4 class="ui inverted header">联系我</h4>
                <div class="ui inverted link list">
                    <a  class="item">所以我</a>
                    <a  class="item">就随便</a>
                    <a  class="item">放了</a>
                </div>
            </div>
            <!--第三列-->
            <div class="three wide column">
                <h4 class="ui inverted header">联系我</h4>
                <div class="ui inverted link list">
                    <a class="item"><i class="qq icon"></i>1198643677</a>
                    <a class="item"><i class="weixin icon"></i>18257709312</a>
                </div>
            </div>
            <!--第四列,网站简介-->
            <div class="seven wide column">
                <h4 class="ui inverted header">网站简介</h4>
                <span class="ui item">
                        这是我的个人站,用于存放一些奇奇怪怪的东西
                    </span>
            </div>
        </div>
    </div>
    <!--分割横线-->
    <div class="ui inverted section divider"></div>
    <!--网站脚-->
    <div class="ui inverted link list" align="center">
        <a rel="nofollow" href="http://beian.miit.gov.cn/" class="ui item">浙ICP备2021038970号</a>
    </div>
</footer>




</body>
</html>